import { createApp } from 'vue'
import ElementPlus from 'element-plus'
// import VueGtm from 'vue-gtm'
import { createGtm} from '@gtm-support/vue-gtm'
import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import store from './store'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// 引入多语言
import i18n from './lang/index'

// import './util/flexible'//自适应

// 确保 dataLayer 全局存在
if (!window.dataLayer) {
    window.dataLayer = [];
}

const app = createApp(App)
app.use (
  createGtm ( { 
    id:'GTM-P9DX5V5H' , //您的GTM单个容器ID，容器ID数组['GTM-xxxxxx'，'GTM-yyyyyy']或对象数组[{id：'GTM-xxxxxx'，queryParams：{gtm_auth：'abc123'，gtm_preview：'env-4'，gtm_cookies_win：'x'}}，{id：'GTM-yyyyyy'，queryParams：{gtm_auth：'abc234'，gtm_preview：'env-5'，gtm_cookies_win：'x'}}]，//您的GTM单个容器ID或容器ID数组['GTM-xxxxxx'，'GTM-yyyyyy']
    enabled : true ,  // 默认为 true。可以通过将其设置为 false 来禁用插件，例如：enabled: !!GDPR_Cookie（可选）
    debug : true ,  // 是否显示控制台日志调试（可选）
    // loadScript : true ,  // 是否加载 GTM 脚本（如果您手动包含 GTM 但需要组件中的 dataLayer 功能，则很有用）（可选）
    vueRouter : router ,  // 传递路由器实例以自动与路由器同步（可选）
    defer: false, // 添加此项以确保 GTM 脚本立即加载
    loadScript: true,
    compatibility: false, // 添加此项以使用新版跟踪方式
    trackOnNextTick : false ,  // 是否在 Vue.nextTick 中调用 trackView
    ignoreViewsInHashMode: false, // 如果使用 hash 模式路由，则忽略 # 符号前的部分（可选）
    enableRouterTracking: true, // 启用路由跟踪，默认为 false
    events: {
      routeChange: true // 启用路由变化事件
    },
  } ) , 
) ;

// router.beforeEach((to, from, next) => {
//   if (to.meta && to.meta.gtm) {
//     document.title = to.meta.gtm; // 设置页面标题
//   }
//   next();
// });
// router.afterEach((to, from) => {
//   if (to.meta && to.meta.gtm) {
//       window.dataLayer.push({
//           event: 'routeChange',
//           pagePath: to.path,
//           pageTitle: to.meta.gtm || document.gtm,
//           gtm: to.meta.gtm
//       });
//   }
//   console.log('from', from.fullPath, 'to', to.fullPath);
// });

for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
  }
app.use(router)
app.use(store)
app.use(ElementPlus)
app.use(i18n)
// app.config.globalProperties.$echarts = echarts;
app.mount('#app')
// createApp(App).use(ElementPlus).use(store).use(router).mount('#app')
// for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
//     app.component(key, component)
//   }